<script setup>
import Feauter from "./feauter.vue"
import customProp from "./customProp.vue"
import { fabric } from "fabric"
import { onMounted, ref } from "vue"
const canvas = ref(null)
const init = () => {
  canvas.value = new fabric.Canvas("canvas-container")
}

onMounted(() => {
  init()
})

// vue3 属性导出
defineExpose({
  canvas
})
</script>

<template>
  <div class="flex flex-justify-between">
    <Feauter :canvas="canvas" v-if="canvas" />
    <canvas id="canvas-container" width="600" height="600" class="border-cyan-100 border-1" />
    <customProp />
  </div>
</template>

<style scoped></style>
